<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%--头部内容开始--%>
<jsp:include page="head.jsp"/>
<%--头部内容结束--%>
<%--中间内容开始--%>
<div class="layui-container fly-marginTop fly-user-main">
    <jsp:include page="manger_left.jsp"/>
    <%--中间右部内容开始--%>
    <div class="fly-panel fly-panel-user" pad20>
        <div class="layui-tab layui-tab-brief" lay-filter="user">
            <ul class="layui-tab-title" id="LAY_mine">
                <li class="layui-this" lay-id="info">我的资料</li>
                <li lay-id="avatar">头像</li>
                <li lay-id="pass">修改密码</li>
            </ul>
            <%--各个板块--%>
            <div class="layui-tab-content" style="padding: 20px 0;">
                <%--个人信息板块--%>
                <div class="layui-form layui-form-pane layui-tab-item layui-show">
                    <form:form action="${pageContext.request.contextPath}/user/student/updateNickName.do" method="post">
                        <div class="layui-form-item">
                            <label for="uNickName" class="layui-form-label">昵称</label>
                            <div class="layui-input-inline">
                                <input type="hidden" name="uId" value="${user.uId}">
                                <input type="text" id="uNickName" name="uNickName" required lay-verify="required" autocomplete="off" value="${user.uNickName}" class="layui-input">
                            </div>
                            <%--<div class="layui-inline">
                                <div class="layui-input-inline">
                                    <input type="radio" name="sex" value="0" checked title="男">
                                    <input type="radio" name="sex" value="1" title="女">
                                </div>
                            </div>--%>
                        </div>
                        <div class="layui-form-item">
                            <button class="layui-btn" key="set-mine" lay-filter="*" lay-submit>确认修改</button>
                        </div>
                    </form:form>
                </div>

                <%--头像上传板块--%>
                    <div class="layui-form layui-form-pane layui-tab-item">
                        <input type="hidden" name="images" class="image">
                        <div class="layui-form-item">
                            <div class="avatar-add">
                                <p>建议尺寸168*168，支持jpg、png、gif，最大不能超过50KB</p>
                                    <button type="button" class="layui-btn upload-img"><span id="test1"><i class="layui-icon">&#xe67c;</i>上传头像</span></button>
                                <img src="${pageContext.request.contextPath}${user.uImage}" id="demo1">
                                <span class="loading" id="demoText"></span>
                            </div>
                        </div>
                    </div>
                <%--修改密码板块--%>
                <div class="layui-form layui-form-pane layui-tab-item">
                    <form:form action="${pageContext.request.contextPath}/user/student/editpwd.do" method="post">
                        <div class="layui-form-item">
                            <label for="pwd" class="layui-form-label">当前密码</label>
                            <div class="layui-input-inline">
                                <input type="password" id="pwd" required lay-verify="required|oldPwd" autocomplete="off" class="layui-input">
                                <%--<input type="hidden" id="oldPwd" value="${pwd}">&lt;%&ndash;原始密码&ndash;%&gt;--%>
                                <input type="hidden" name="uId" value="${uId}"><%--用户id--%>
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label for="newPwd" class="layui-form-label">新密码</label>
                            <div class="layui-input-inline">
                                <input type="password" id="newPwd" name="uPassword" required lay-verify="required|newPwd|confirmPwd" autocomplete="off" class="layui-input">
                            </div>
                            <div class="layui-form-mid layui-word-aux">6到16个字符</div>
                        </div>
                        <div class="layui-form-item">
                            <label for="confirmPwd" class="layui-form-label">确认密码</label>
                            <div class="layui-input-inline">
                                <input type="password" id="confirmPwd" name="confirmPwd" required lay-verify="required|newPwd|confirmPwd" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <button class="layui-btn" key="set-mine" lay-filter="*" lay-submit>确认修改</button>
                        </div>
                    </form:form>
                </div>
            </div>
        </div>
    </div>
</div>
<%--中间内容结束--%>
<%--底部内容开始--%>
<jsp:include page="bottom.jsp"/>
<%--${pageContext.request.contextPath}/fileInfo/student/uploadHeadImg.do--%>
<%--上传头像js--%>
<script>
    layui.use('upload', function(){
        var $ = layui.jquery,upload = layui.upload;
        //普通图片上传
        var uploadInst = upload.render({
            elem: '#test1',
            url: '${pageContext.request.contextPath}/user/student/uploadHeadImg.do',
            accept: 'images',
            before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#demo1').attr('src', result); //图片链接（base64）
                });
            },
            done: function(json){
                //如果上传失败
                if(json.code == 0){
                    return layer.msg('上传失败！');
                }
                //上传成功
                if(json.code > 0){
                    layer.msg('上传成功！')
                    location.reload();
                    return;

                }
            }
        });
    });
</script>
<%--校验表单--%>
<script>
    layui.use([ 'form' ], function() {
        var form = layui.form,
            layer = layui.layer,
            $ = layui.jquery;
        /* 自定义表单验证 */
        form.verify({
            //原始密码验证
            oldPwd : function(value, item){
                var message = '';
                $.ajax({
                    type:"POST",
                    url:'${pageContext.request.contextPath}/blog/student/repwd.do',
                    async: false, //改为同步请求
                    data:{"pwd":value},
                    success:function(data){
                        if(data.code==0){
                            message='';
                        }else{
                            message ="原始密码输入错误！";
                        }
                        console.log('code='+data.code);
                        console.log('message='+message);
                    }
                });
                //需要注意  需要将返回信息写在ajax方法外
                if (message!='') {
                    return message;
                }
            },
            newPwd : [ /^[\S]{6,16}$/, '密码必须6到16位，且不能出现空格' ],

            confirmPwd : function(value, item){
                if($("#newPwd").val()!=value){
                    return "两次输入密码不一致，请重新输入！";
                }
            }
        });
    });
</script>
<%--checkUser_pwd : [ /^[\S]{6,16}$/, '密码必须6到16位，且不能出现空格' ]--%>
<%--底部内容结束--%>